<template>
	<view class="pay-detail">
		<image :src="goodsDetail.goodsImages" class="bimg" mode=""></image>
		<view class="cont-info">
			<view class="cont">
				<view class="name-txt">
					<view class="l">商品名：</view>
					<view class="c">
						{{goodsDetail.productName}}
					</view>
				</view>
				<view class="pric">
					费用：<text class="pr">¥{{(Number(goodsDetail.price) * Number(orderElementPicLen)).toFixed(1)}}</text>
				</view>
				<view class="pay-type">
					选择支付方式
					<view class="p-item">
						<image src="../../static/wx.png" class="wx" mode=""></image>
						<view class="p-r">
							微信支付
							<view class="desc">推荐已安装微信客户端使用</view>
						</view>
						<image src="../../static/check-pay.png" class="check-pay" mode=""></image>
					</view>
				</view>
			</view>
			<view class="p-hr"></view>
			 <!-- @tap="goUrl('/pagesB/pay/payment')" -->
			<view class="p-bnt" @tap="goPayOrder" v-if="isPay == 1">
				确认支付
			</view>
			<view class="p-bnt" @tap="goPay" v-if="isPay == 0">
				确认支付
			</view>
			<view class="p-bnt" @tap="goGoodsPay" v-if="isPay == 2">
				确认支付
			</view>
		</view>
	</view>
</template>

<script>
	import {getGoodsInfo,createGoodsOrder,nailPayOrder,settlementCartGoodsOrder} from '@/api/goods.js'
	export default {
		data() {
			return {
				goodsDetail: {
					productName: '',
					price: ''
				},
				def: {},
				num: 1,
				payOrderId: '',
				isPay: 0,
				orderElementPicLen: 0,
				diyUrl: ''
			};
		},
		onLoad(ops) {
			let orderElementPic = uni.getStorageSync('orderElementPic') || []
			console.log('-------ops------',ops)
			if(ops.payType == 1001) {
				this.isPay = 1
				let data = uni.getStorageSync('payInfo') || {}
				this.goodsDetail.goodsImages = data.subjectFirstPage || data.goodsImg
				this.goodsDetail.productName = data.goodsName
				this.goodsDetail.price = data.goodsTotalPrice
			}else if(ops.payType == 2001) {
				this.def = ops
				this.isPay = 2
				this.getInfo()
			} else{
				let info = JSON.parse(decodeURIComponent(ops.info));
				console.log('------info-----', info);
				this.def = info
				this.getInfo()
			}
			this.orderElementPicLen = uni.getStorageSync('orderElementPicLen')
			this.diyUrl = uni.getStorageSync('diyUrlList') || []
		},
		methods:{
			goUrl(url){
				uni.navigateTo({
					url
				})
			},
			getInfo() {
				getGoodsInfo({id:this.def.id}).then((res) => {
					this.goodsDetail = res
					this.goodsDetail.goodsImages = res.goodsImages.split(',')[0]
				})
			},
			goPay(){
				let merchantId = uni.getStorageSync('merchantId')
				let orderElementPic = uni.getStorageSync('orderElementPic') || []
				if(!this.payOrder){
					console.log('未创建~')
					let order = {
						addressId: this.def.addrId,
						goodsCount: this.orderElementPicLen, // 打印个数
						goodsId: this.goodsDetail.id,
						goodsName: this.goodsDetail.productName,
						goodsTotalPrice: parseFloat((this.orderElementPicLen * this.goodsDetail.price).toFixed(10)) * 100,
						goodsUnitPrice: this.goodsDetail.price,// 单价
						orderElementPic: orderElementPic.join(','),
						orderOrigin: this.def.orderOrigin,
						payAmount: parseFloat((this.orderElementPicLen * this.goodsDetail.price).toFixed(10)) * 100,
						paymentType: 1,
						showId: this.def.orderOrigin ==1 ? '' : this.def.showId,
						subjectId: this.def.subjectId,
						diyUrl: this.diyUrl.join(','),
						tenantId:merchantId
					}
					console.log(order,'order')
					// 创建订单
					createGoodsOrder(order).then((res) => {
						console.log(res,'创建订单')
						this.payOrderId = res.id
						payOrder()
					})
				}else{
					console.log('已创建~')
					payOrder()
				}
				
				const payOrder = () => {
					// 支付订单获取微信所需参数
					let params = {
						orderId: this.payOrderId,//this.detail.id,
						orderType: 2,
						payAmount: parseFloat((this.orderElementPicLen * this.goodsDetail.price).toFixed(10)) * 100,
						paymentType: 1,
						orderDesc: this.goodsDetail.productName
					}
					nailPayOrder(params).then((res) => {
						console.log(res,'支付订单~~~~')
						//调起微信支付请求
						wx.requestPayment({
							"timeStamp":""+res.timeStamp+"",
							"nonceStr":res.nonceStr,
							"package": res.package,
							"signType": res.signType,
							"paySign": res.paySign,
							success:function(resp){
								console.log('success:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付成功',
								   icon: 'none',
								   duration: 2000
								});
								uni.redirectTo({
									url: '/pagesB/pay/payment?payAmount='+ (params.payAmount / 100) + '&type=2'
								})
							},
							fail:function(resp){
								console.log('fail:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付失败',
								   icon: 'none'
								});
							}
						})
					})
				}
			},
			// 再次支付
			goPayOrder(){
				let data = uni.getStorageSync('payInfo') || {}
				// 支付订单获取微信所需参数
				let params = {
					orderId: data.id,
					orderType: 2,
					payAmount: data.payAmount * 100,
					paymentType: 1,
					orderDesc: data.goodsName
				}
				uni.showLoading({
				    title: '支付中...'
				});
				nailPayOrder(params).then((res) => {
					console.log(res,'支付订单~~~~')
					//调起微信支付请求
					console.log(res,'09',res.timestamp)
					uni.hideLoading()
					wx.requestPayment({
						"timeStamp":""+res.timeStamp+"",
						"nonceStr":res.nonceStr,
						"package": res.package,
						"signType": res.signType,
						"paySign": res.paySign,
						success:function(resp){
							console.log('success:' + JSON.stringify(resp));
							uni.showToast({
							   title: '支付成功',
							   icon: 'none',
							   duration: 2000
							});
							uni.redirectTo({
								url: '/pagesB/pay/payment?payAmount='+ (params.payAmount / 100) + '&type=2'
							})
						},
						fail:function(resp){
							console.log('fail:' + JSON.stringify(resp));
							uni.showToast({
							   title: '支付失败',
							   icon: 'none'
							});
						}
					})
				})
			},
			goGoodsPay() {
				console.log('goGoodsPay')
				// [{
				//   "id": "123344",
				//   "goodsName": "甲片",
				//   "unitPrice": 30.50,
				//   "count": 2
				//  },
				//  {
				//   "id": "123345",
				//   "goodsName": "120色加油胶",
				//   "unitPrice": 120,
				//   "count": 1
				//  }
				// ]
				let cart = uni.getStorageSync('cartListData')
				let cartJson = []
				cart.forEach((ele) => {
					cartJson.push({
						id: ele.id,
						goodsName: ele.goodsName,
						unitPrice: ele.unitPrice,
						count: ele.count
					})
				})
				let params = {
					addressId: this.def.addrId,
					cartJson
					// cartJson: [{
					// 	id: this.goodsDetail.id,
					// 	goodsName: this.goodsDetail.productName,
					// 	unitPrice: this.goodsDetail.price,
					// 	count: 1
					// }]
				} 
				settlementCartGoodsOrder(params).then((res) => {
					let params = {
						orderId: res.id,
						orderType: 3,
						payAmount: res.payAmount * 100,
						paymentType: 1,
						orderDesc: res.goodsName
					}
					uni.showLoading({
					    title: '支付中...'
					});
					return
					nailPayOrder(params).then((res) => {
						console.log(res,'支付订单~~~~')
						//调起微信支付请求
						uni.hideLoading()
						wx.requestPayment({
							"timeStamp":""+res.timeStamp+"",
							"nonceStr":res.nonceStr,
							"package": res.package,
							"signType": res.signType,
							"paySign": res.paySign,
							success:function(resp){
								console.log('success:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付成功',
								   icon: 'none',
								   duration: 2000
								});
								uni.redirectTo({
									url: '/pagesB/pay/payment?payAmount='+ (params.payAmount / 100) + '&type=3'
								})
							},
							fail:function(resp){
								console.log('fail:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付失败',
								   icon: 'none'
								});
							}
						})
					})
				})
			}
		}
	}
</script>

<style lang="less" scoped>
.pay-detail{
	.bimg{
		width: 750rpx;
		height: 560rpx;
	}
	.cont-info{
		position: absolute;
		left: 0px;
		top: 504rpx;
		// bottom: 0;
		width: 750rpx;
		height: 944rpx;
		border-radius: 40rpx 40rpx 0px 0px;
		background: linear-gradient(180deg, #FFFFFF 4%, rgba(246,241,235,0.00) 100%);
		box-shadow: 0px 8rpx 20rpx 0px rgba(228, 73, 91, 0.05);
		
		.cont{
			font-size: 36rpx;
			margin: 0 32rpx;
			margin-top: 32rpx;
		}
		.name-txt{
			display: flex;
			.l{
				width: 144rpx;
			}
			.c{
				flex: 1;
				font-size: 32rpx;
			}
		}
		.pric{
			margin-top: 16rpx;
			.pr{
				color: #E4919D;
			}
		}
		.pay-type{
			font-size: 32rpx;
			color: #666;
			margin-top: 78rpx;
			.p-item{
				display: flex;
				align-items: center;
				margin-top: 48rpx;
				.wx{
					width: 88rpx;
					height: 88rpx;
					vertical-align: middle;
				}
				.check-pay{
					width: 48rpx;
					height: 48rpx;
				}
				.p-r{
					font-size: 32rpx;
					color: #333333;
					flex: 1;
					margin-left: 6rpx;
					.desc{
						font-size: 24rpx;
						color: #666;
					}
				}
			}
		}
		.p-hr{
			height: 1rpx;
			background-color: #e0e5e5;
			margin: 0 32rpx;
			margin-top: 24rpx;
		}
		.p-bnt{
			height: 98rpx;
			line-height: 98rpx;
			text-align: center;
			border-radius: 50rpx;
			background: #E4919D;
			color: #FFFFFF;
			font-size: 36rpx;
			margin: 0 32rpx;
			margin-top: 163rpx;
		}
	}
}
</style>
